<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ~ Copyright © 2013-2016 The Nxt Core Developers.                            ~
  ~ Copyright © 2016-2017 Jelurida IP B.V.                                    ~
  ~                                                                           ~
  ~ See the LICENSE.txt file at the top-level directory of this distribution  ~
  ~ for licensing information.                                                ~
  ~                                                                           ~
  ~ Unless otherwise agreed in a custom licensing agreement with Jelurida B.V.,
  ~ no part of the Nxt software, including this file, may be copied, modified,~
  ~ propagated, or distributed except according to the terms contained in the ~
  ~ LICENSE.txt file.                                                         ~
  ~                                                                           ~
  ~ Removal or modification of this copyright notice is prohibited.           ~
  ~                                                                           ~
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->

<header class="header">
    <span id="logo">
        <a href="#" class="logo" data-page="dashboard">
            <img src="img/nxt_logo_small.png" style="opacity:0.95" />
        </a>
    </span>
    <nav class="navbar navbar-static-top" role="navigation">
        <a href="#" class="navbar-btn sidebar-toggle" id="offcanvas_toggle" role="button">
            <span class="sr-only" data-i18n="toggle_navigation">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </a>
        <div id="header_right" class="navbar-right">
            <ul class="nav navbar-nav sends">
                <li id="header_send_money" class="dropdown">
                    <a href="#" data-toggle="modal" data-target="#send_money_modal" data-i18n="send_nxt">Send NXT</a>
                </li>
                <li id="header_send_message" class="dropdown">
                    <a href="#" data-toggle="modal" data-target="#send_message_modal" data-i18n="send_message">Send Message</a>
                </li>
                <li class="client_options dropdown">
                    <a href="#" data-toggle="modal" data-target="#client_status_modal" id="header_client_options_link" ></a>
                </li>
            </ul>
            <ul class="nav navbar-nav">
                <li>
                    <a class="client_options" href="#" data-toggle="modal" data-target="#client_status_modal">
                        <span class="badge nm_outer2" style="background-color: #fff;padding:2px;">
                            <span id="confirmation_rate_indicator" class="badge nm_inner_subtype" style="background-color: #a94442;">
                                <span style="color: #fff;">
                                    &nbsp;<i class="fa fa-bolt" style="font-size: 14px;"></i>&nbsp;
                                </span>
                            </span>
                        </span>
                    </a>
                </li>
                <li>
                    <a href="#" id="unconfirmed_notification_menu" class="goto-page" data-page="transactions" data-subpage="unconfirmed" style="display:none;">
                        <span class="badge nm_outer2" style="background-color: #fff;padding:3px;">
                            <span class="badge nm_inner_subtype" style="background-color: #fff;">
                                <span style="color:#337ab7;">
                                    <i class="fa fa-circle-o"></i>&nbsp;
                                </span>
                                <span style="color:#666;" id="unconfirmed_notification_counter"></span>
                            </span>
                        </span>
                    </a>
                </li>
                <li style="display:none;">
                    <a href="#" id="phasing_notification_menu" class="goto-page" data-page="transactions" data-subpage="phasing">
                        <span class="badge nm_outer2" style="background-color: #fff;padding:3px;">
                            <span class="badge nm_inner_subtype" style="background-color: #fff;">
                                <span style="color:#337ab7;">
                                    <i class="fa fa-gavel"></i>&nbsp
                                </span>
                                <span style="color:#666;" id="phasing_notification_counter"></span>
                            </span>
                        </span>
                    </a>
                </li>
                <li>
                    <a href="#" id="notification_menu" data-toggle="popover" data-placement="bottom" data-content="" style="display:none;">
                        <span class="badge nm_outer" style="background-color: #fff;padding:3px;">
                            <span class="badge nm_inner_subtype"></span>
                            <span class="badge nm_inner_total"></span>
                        </span>
                    </a>
                </li>
                <li id="contacts_menu_li" role="presentation" class="active show_popover" data-toggle="popover" data-delay="250" data-placement="bottom" data-content="CONTACTS" data-container="#header_right" data-i18n="[data-content]contacts">
                    <a href="#" class="goto-page" data-page="contacts">
                        <i class="fa fa-user"></i>
                    </a>
                </li>
                <li id="exchange_menu_li" role="presentation" class="active show_popover" data-toggle="popover" data-delay="250" data-placement="bottom" data-content="EXCHANGE" data-container="#header_right" data-i18n="[data-content]exchange">
                    <a href="#" class="goto-page" data-page="exchange">
                        <i class="fa fa-exchange"></i>
                    </a>
                </li>
                <li class="dropdown show_popover" role="presentation" data-toggle="popover" data-delay="250" data-placement="bottom" data-content="SETTINGS" data-container="#header_right" data-i18n="[data-content]settings">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                        <i class="fa fa-cog"></i>
                    </a>
                    <ul class="dropdown-menu" role="menu">
                        <li><a role="menuitem" tabindex="-1" href="#" class="goto-page" data-page="blocks"><i class="fa fa-bars"></i><span data-i18n="blocks">Blocks</span></a></li>
                        <li><a role="menuitem" tabindex="-1" href="#" class="goto-page" data-page="peers"><i class="fa fa-cloud"></i><span data-i18n="peers">Peers</span></a></li>
                        <li><a role="menuitem" tabindex="-1" href="#" class="goto-page" data-page="generators"><i class="fa fa-code-fork"></i><span data-i18n="generators">Generators</span></a></li>
                        <li id="funding_monitor_menu_item"><a role="menuitem" tabindex="-1" href="#" class="goto-page" data-page="funding_monitors"><i class="fa fa-shekel"></i><span data-i18n="monitors">Monitors</span></a></li>
                        <li role="presentation" class="divider"></li>
                        <li><a href="#" class="goto-page" data-page="plugins_overview"><i class="fa fa-plug"></i><span data-i18n="plugins">Plugins</span></a></li>
                        <li role="presentation" class="divider"></li>
                        <li><a href="#" class="goto-page" data-page="settings"><i class="fa fa-cog"></i><span data-i18n="account_settings">Account Settings</span></a></li>
                        <li id="mobile_settings_li"><a href="#" data-toggle="modal" data-target="#mobile_settings_modal"><i class="fa fa-mobile"></i><span data-i18n="device_settings">Device Settings</span></a></li>
                        <li role="presentation" class="divider"></li>
                        <li><a href="#" data-toggle="modal" data-target="#token_modal"><i class="fa fa-code"></i><span data-i18n="generate_token">Generate Token</span></a></li>
                        <li><a href="#" data-toggle="modal" data-target="#hallmark_modal"><i class="fa fa-building"></i><span data-i18n="generate_hallmark">Generate Hallmark</span></a></li>
                        <li><a href="#" data-toggle="modal" data-target="#hash_modal"><i class="fa fa-calculator"></i><span data-i18n="calculate_hash">Calculate Hash</span></a></li>
                        <li><a href="#" data-toggle="modal" data-target="#transaction_json_modal"><i class="fa fa-asterisk"></i><span data-i18n="transaction_operations">Transaction Operations</span></a></li>
                        <li role="presentation" class="divider"></li>
                        <li><a href="#" id="refreshSearchIndex"><i class="fa fa-search"></i><span data-i18n="refresh_search_index">Refresh Search Index</span></a></li>
                        <li id="api_console_li"><a href="/test" target="_blank"><i class="fa fa-magic"></i><span data-i18n="api_console">API Console</span></a></li>
                        <li id="database_shell_li"><a href="/dbshell" target="_blank"><i class="fa fa-database"></i><span data-i18n="database_shell">Database Shell</span></a></li>
                    </ul>
                </li>
                <li class="dropdown show_popover" role="presentation" data-toggle="popover" data-delay="250" data-placement="bottom" data-content="HELP" data-container="#header_right" data-i18n="[data-content]help">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                        <i class="fa fa-question-circle"></i>
                    </a>
                    <ul class="dropdown-menu" role="menu">
						<li><a href="#" data-toggle="modal" data-target="#about_modal"><i class="fa fa-info-circle "></i><span data-i18n="about_nxt">About Nxt</span></a></li>
                        <li><a role="menuitem" tabindex="-1" href="#" class="goto-page" data-page="news"><i class="fa fa-book"></i><span data-i18n="news">News</span></a></li>
                        <li role="presentation" class="divider"></li>
                        <li><a class="external-link" role="menuitem" tabindex="-1" href="https://nxt.org/" target="_blank"><i class="fa fa-at"></i>Nxt.org</a></li>
                        <li><a class="external-link" role="menuitem" tabindex="-1" href="https://nxtforum.org/" target="_blank" ><i class="fa fa-at"></i><span data-i18n="link_nxt_forum">Nxt Forum</span></a></li>
                        <li><a class="external-link" role="menuitem" tabindex="-1" href="https://nxtwiki.org/" target="_blank"><i class="fa fa-at"></i><span data-i18n="link_nxt_wiki">Nxt Wiki</span></a></li>
                        <li><a class="external-link" role="menuitem" tabindex="-1" href="https://nxtwiki.org/wiki/Nxt_client_interface" target="_blank"><i class="fa fa-at"></i><span data-i18n="link_interface_tutorial">Interface Tutorial</span></a></li>
                        <li><a class="external-link" role="menuitem" tabindex="-1" href="https://nxtwiki.org/wiki/Asset_Exchange" target="_blank"><i class="fa fa-at"></i><span data-i18n="link_asset_exchange_tutorial">Asset Exchange Tutorial</span></a></li>
                        <li><a class="external-link" role="menuitem" tabindex="-1" href="https://nxtwiki.org/wiki/Monetary_System" target="_blank"><i class="fa fa-at"></i><span data-i18n="link_monetary_system_tutorial">Monetary System Tutorial</span></a></li>
                        <li><a class="external-link" role="menuitem" tabindex="-1" href="https://nxtwiki.org/wiki/Voting_System" target="_blank"><i class="fa fa-at"></i><span data-i18n="link_voting_system_tutorial">Voting System Tutorial</span></a></li>
                        <li><a class="external-link" role="menuitem" tabindex="-1" href="https://nxtwiki.org/wiki/Phasing" target="_blank"><i class="fa fa-at"></i><span data-i18n="link_phasing_tutorial">Phasing Tutorial</span></a></li>
                        <li><a class="external-link" role="menuitem" tabindex="-1" href="https://nxtwiki.org/wiki/Plugins" target="_blank"><i class="fa fa-at"></i><span data-i18n="link_plugins_tutorial">Plugins Tutorial</span></a></li>
                    </ul>
                </li>
                <li class="dropdown show_popover" id="web_wallet_li" role="presentation" data-toggle="popover" data-delay="250" data-placement="bottom" data-content="WEB WALLET" data-container="#header_right" data-i18n="[data-content]web_wallet">
                    <a href="#" class="dropdown-toggle"  data-toggle="dropdown" id="header_open_web_wallet">
                        <i class="fa fa-sitemap"></i>
                    </a>
                </li>
                <li class="dropdown" id="logout_button_container">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" id="logout_button">
                        <i class="fa fa-power-off"></i>
                    </a>
                    <ul class="dropdown-menu" role="menu">
                        <li><a role="menuitem" tabindex="-1" href="#" onclick="NRS.logout()" data-i18n="logout">Log Out</a></li>
                        <li><a role="menuitem" tabindex="-1" href="#" onclick="NRS.logout(true)" data-i18n="logout_stop_forging">Log Out &amp; Stop Forging</a></li>
                        <li><a role="menuitem" tabindex="-1" href="#" data-toggle="modal" data-target="#logout_clear_user_data_modal" data-i18n="logout_clear_user_data">Log Out and Clear User Data</a></li>
                    </ul>
                </li>
            </ul>
        </div>
    </nav>
</header>
